<template>
  <div class="gameInfoShuDu_main">
    <div class="gameInfoShuDu_pic"></div>

    <div class="gameInfoShuDu_text">
      <span>游戏简介</span>
      <p>数独（shù dú）是源自18世纪瑞士的一种数学游戏。是一种运用纸、笔进行演算的逻辑游戏。玩家需要根据9×9盘面上的已知数字，推理出所有剩余空格的数字，并满足每一行、每一列、每一个粗线宫（3*3）内的数字均含1-9，不重复 [1]  。</p>
      <p>数独盘面是个九宫，每一宫又分为九个小格。在这八十一格中给出一定的已知数字和解题条件，利用逻辑和推理，在其他的空格上填入1-9的数字。使1-9每个数字在每一行、每一列和每一宫中都只出现一次，所以又称“九宫格”。</p>
      <span>解题手法</span>
      <p>依解题填制的过程可区分为直观法与候选数法。</p>
      <p>直观法就是不做任何记号，直接从数独的盘势观察线索，推论答案的方法。</p>
      <p>候选数法就是删减等位群格位已出现的数字，将剩余可填数字填入空格做为解题线索的参考，可填数字称为候选数(Candidates，或称备选数)。</p>
      <p>直观法和候选数法只是填制时候是否有注记的区别，依照个人习惯而定，并非鉴定题目难度或技巧难度的标准，无论是难题或是简单题都可上述方法填制，一般程序解题以候选数法较多。</p>
    </div>


  </div>
  <div class="gameInfoShuDu_main_2">
    <div class="gameInfoShuDu_main_2_ad">
      <div class="gameInfoShuDu_main_2_ad_title">
        <span>广告</span>&nbsp;<span id="close_ad" @click="close_adv">✖</span>
      </div>
      <video src="https://cloud.video.taobao.com//play/u/1621790841/p/1/e/6/t/1/390848881750.mp4" id="vdo" loop muted autoplay></video>
    </div>
    <div class="gameInfoShuDu_main_2_start_button">开始游戏</div>
  </div>
</template>

<script>
export default {
  name: "gameinfoShuDu",

  methods:{
    close_adv:function (){
      document.getElementById("vdo").style.visibility="hidden";
      document.getElementsByClassName("gameInfoShuDu_main_2_ad_title")[0].style.visibility="hidden";
    }
  }
}

function cancle_mute_f(){
  alert(1);

}
</script>

<style scoped>
#close_ad{
  cursor: pointer;
  z-index: 500;
  display: inline-block;
  height: 20px;
}

.gameInfoShuDu_main_2_ad_title{
  font-size: 14px;
  color: rgb(0,120,215);
  background-color: white;
  display: inline-block;
  padding-left: 3px;
  padding-right: 3px;
  position: absolute;
  right: 0;
}

.gameInfoShuDu_main_2_ad>video{
  width: 800px;
  height: 200px;
}

.gameInfoShuDu_main_2_ad{
  width: 800px;
  height: 200px;
  float: right;
  background-color: rgb(230,230,230);
  overflow: clip;
  border-radius: 3px;
}

.gameInfoShuDu_main_2_start_button{
  width: 200px;
  height: 70px;
  border-radius: 10px;
  background-color: limegreen;
  font-size: 22px;
  text-align: center;
  line-height: 70px;
  color: white;
  transition: all 0.1s;
  cursor: pointer;
  display: inline-block;
  position: absolute;
  left: 100px;
  top: 65px;
}

.gameInfoShuDu_main_2_start_button:hover{
  background-color: #51e851;
}

.gameInfoShuDu_main_2_start_button:active{
  scale: 97%;
}

.gameInfoShuDu_text>span{
  font-weight: bold;
}

.gameInfoShuDu_text>p{
  text-indent: 2em;

}

.gameInfoShuDu_text{
  width: 800px;
  height: 475px;
  float: right;
  padding: 20px 20px;
  line-height: 28px;
  display: inline-block;
}

.gameInfoShuDu_main{
  width: 1200px;
  height: 475px;
  /*background-color: wheat;*/
  border-radius: 15px;
  overflow: clip;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  background-color: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
}

.gameInfoShuDu_main_2{
  width: 1200px;
  height: 200px;
  /*background-color: wheat;*/
  border-radius: 15px;
  overflow: clip;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  margin-top: 30px;
  margin-bottom: 20px;
  overflow: clip;
  background-color: rgba(255, 255, 255, 0.4);
  backdrop-filter: blur(10px);
}

.gameInfoShuDu_pic{
  height: 475px;
  width: 400px;
  display: inline-block;
  float: left;
  background-color: rgb(230,230,230);
  background-position: -40px;
  background-size: 700px;
  background-repeat: no-repeat;
  background-image: url("/src/assets/banner/2.jpg");
  border-radius: 10px;
}
</style>